<form name="frmMock" class="form-horizontal" ng-init="dvm.init()" ng-submit="dvm.save(frmMock.$valid)" novalidate>
  <div class="modal-header">
    <button type="button" class="close" ng-click="dvm.cancel()">&times;</button>
    <h4 class="modal-title">编辑MOCK数据</h4>
  </div>
  <div class="modal-body">
    <div class="form-group">
      <label class="col-sm-3 col-md-2 control-label">上级路径：</label>
      <div class="col-sm-9 col-md-10">
        <input type="text" class="form-control" value="{{dvm.parent}}" readonly>
      </div>
    </div>
    <div class="form-group">
      <label class="col-sm-3 col-md-2 control-label">类型：</label>
      <div class="col-sm-9 col-md-10">
        <label class="radio-inline">
          <input name="type" type="radio" value="folder" ng-model="dvm.type" ng-disabled="!dvm.modifiable">文件夹
        </label>
        <label class="radio-inline">
          <input name="type" type="radio" value="file" ng-model="dvm.type" ng-disabled="!dvm.modifiable">文件
        </label>
      </div>
    </div>
    <div class="form-group" ng-if="dvm.type == 'folder'">
      <label class="col-sm-3 col-md-2 control-label">文件夹：</label>
      <div class="col-sm-9 col-md-10">
        <input name="folder" type="text" class="form-control" ng-model="dvm.folder" required autofocus
            pattern="{{dvm.modifiable ? '^(/?\{?[0-9A-Za-z_@-]+\}?)+$' : '^\{?[0-9A-Za-z_@-]+\}?$'}}"
            ng-class="{'x-invalid': frmMock.$submitted && frmMock.folder.$invalid}"
            placeholder="{{dvm.modifiable ? '/folder/.../folder' : 'folder'}}">
        <p class="text-danger" ng-show="frmMock.$submitted && frmMock.folder.$error.required">文件夹名不能为空</p>
        <p class="text-danger" ng-show="frmMock.$submitted && frmMock.folder.$error.pattern">文件夹名格式错误</p>
      </div>
    </div>
    <div class="form-group" ng-if="dvm.type == 'file'">
      <label class="col-sm-3 col-md-2 control-label">文件：</label>
      <div class="col-sm-9 col-md-10">
        <div class="input-group">
          <input name="file" type="text" class="form-control" ng-model="dvm.file" required autofocus
              pattern="{{dvm.modifiable ? '^(/?\{?[0-9A-Za-z_@-]+\}?)+$' : '^\{?[0-9A-Za-z_@-]+\}?$'}}"
              ng-class="{'x-invalid': frmMock.$submitted && frmMock.file.$invalid}"
              placeholder="{{dvm.modifiable ? '/folder/.../file' : 'file'}}">
          <span class="input-group-addon" ng-if="dvm.extname == '.json' || dvm.extname == '.xml'">
            <select ng-model="dvm.method">
              <option value="">-请求方式-</option>
              <option value=".get">GET</option>
              <option value=".post">POST</option>
              <option value=".put">PUT</option>
              <option value=".patch">PATCH</option>
              <option value=".delete">DELETE</option>
            </select>
          </span>
          <span class="input-group-addon">
            <select name="extname" ng-model="dvm.extname" required ng-disabled="!dvm.modifiable">
              <option value="">-类型-</option>
              <option value=".json">JSON(*.json)</option>
              <option value=".xml">XML(*.xml)</option>
              <option value=".md">Markdown(*.md)</option>
            </select>
          </span>
        </div>
        <p class="text-danger" ng-show="frmMock.$submitted && frmMock.file.$error.required">文件名不能为空</p>
        <p class="text-danger" ng-show="frmMock.$submitted && frmMock.file.$error.pattern">文件名格式错误</p>
        <p class="text-danger" ng-show="frmMock.$submitted && frmMock.extname.$error.required">文件类型不能为空</p>
      </div>
    </div>
  </div>
  <div class="modal-footer">
    <button type="submit" class="btn btn-default" ng-disabled="frmMock.$invalid || !dvm.changed">
      <i class="fa fa-save"></i> 保存</button>
    <button type="button" class="btn btn-default" ng-click="dvm.cancel()">
      <i class="fa fa-times"></i> 取消</button>
  </div>
</form>
